/**
* @description: 标准化作业--作业信息
* @author: wqn
* @data:2023年6月19日
* @remark:
**/
<template>
	<view class="jobInfo">
		<nav-bar title="作业信息-填写/编辑" @goBack="goBack"></nav-bar>
		<view class="main">
			<van-form ref="ruleForm">
				<view class="top-filed">
					<van-field v-model="fieldValue.workPlanStrtime" readonly label="计划开始时间" required input-align="right"
						placeholder="请选择" :rules="[{ required: true,trigger:'onChange', message: '' }]"
						right-icon="arrow" @click-right-icon="changePlanTime('start')" />
					<van-field v-model="fieldValue.workPlanEndtime" readonly label="计划结束时间" required input-align="right"
						placeholder="请选择" :rules="[{ required: true,trigger:'onChange', message: '' }]"
						right-icon="arrow" @click-right-icon="changePlanTime('end')" />
					<van-field v-model="fieldValue.workPlanPerson" readonly label="责任人" required
						:rules="[{ required: true,trigger:'onChange', message: '' }]" input-align="right"
						placeholder="请选择" right-icon="arrow" @click-right-icon="handleSelectUser('责任人')" />
				</view>
				<view class="bottom-filed">
					<van-cell title="作业成员" required />
					<van-field v-model="fieldValue.discussers2Name" readonly label="班组成员" input-align="right" 
						:rules="(fieldValue.discussers2Name !=='' || fieldValue.discussers3Name !=='') ? [] : [{ required: true,trigger:'onChange', message: '' }]"
						placeholder="请选择" right-icon="arrow" @click-right-icon="handleSelectUser('班组成员')" />
					<van-field v-model="fieldValue.discussers3Name" readonly label="外部厂商成员" input-align="right" 
						:rules="(fieldValue.discussers2Name !=='' || fieldValue.discussers3Name !=='') ? [] : [{ required: true,trigger:'onChange', message: '' }]"
						placeholder="请选择" right-icon="arrow" @click-right-icon="handleSelectUser('外部厂商成员')" />
				</view>
			</van-form>
			<!--提交按钮-->
			<view class="verify">
				<van-button type="info" round @click="affirmClick">确认</van-button>
			</view>
			<!-- 时间选择器-->
			<van-popup v-model="showDate" round position="bottom">
				<van-datetime-picker v-model="currentDate" :min-date="minDate" type="datetime" title="选择时间"
					@confirm="selectTime(currentDate)" />
			</van-popup>
			<!-- <van-calendar v-model="showDate" type="multiple" color="#417ADC" @confirm="onConfirm" /> -->
			<!--选择人员-->
			<van-popup v-model="showSelectUser" position="right">
				<selectUser :equIds="equIds" :selectStatus="selectStatus" :selected.sync="staffList"
					@cancel="showSelectUser = false" :roleId="executiveRoleId" @comfirm="userComfirm" />
			</van-popup>
			<!--选择外商人员-->
			<van-popup v-model="showSelectExternalUser" position="right">
				<selectExternalUser :equIds="ExternalUserIds" :selected.sync="ExternalUserList"
					@cancel="showSelectExternalUser = false" :roleId="ExternalUserRoleId"
					@comfirm="userExternalComfirm" />
			</van-popup>
		</view>
	</view>
</template>

<script>
	import NavBar from "../../standardizedOperation/common/navBar.vue";
	import selectUser from "../../standardizedOperation/common/selectUser.vue"
	import {
		Dialog,
		Toast
	} from "vant";
	import {
		selectLwOrgListForeign,
		selectworkinfo
	} from "../../../api/bzhzyApi";
	import selectExternalUser from "../../standardizedOperation/common/selectExternalUser.vue"
	import {
		mapGetters
	} from "vuex";
	import moment from "moment/moment";
	export default {
		name: "jobInfoFilling",
		components: {
			NavBar,
			selectUser,
			selectExternalUser
		},
		data() {
			return {
				date: "",
				fieldValue: {
					workPlanId: "",
					consultationDeductionId: "",
					workPlanStrtime: "",
					workPlanEndtime: "",
					workPlanPerson: "",
					workPlanPersonId: "",
					discussers2: "",
					discussers3: "",
					discussers3Name: "",
					discussers2Name: ""
				},
				planTime: "", //计划时间
				showDate: false,
				showChargePerson: false,
				showTeamMember: false,
				showExternalMember: false,
				showSelectUser: false, //人员选择
				equIds: [], //人员id
				staffList: {}, //选择人员数据
				executiveRoleId: "",
				ExternalUserList: {}, //选择外商人员数据
				showSelectExternalUser: false, //外商人员选择
				ExternalUserRoleId: "",
				ExternalUserIds: [], //外商人员id
				peopleType: "", //区分人员
				currentDate: new Date(),
				minDate:new Date(),
				planTimeTag: null, //start开始时间 end结束时间
				selectStatus: "checkbox", //负责人单选   班组成员多选
			}
		},
		onLoad(option) {
			this.work = JSON.parse(option.message)
			this.fieldValue.workPlanPerson = this.userData.userName
			this.fieldValue.workPlanPersonId = this.userData.userId
			//回显作业信息
			this.getSelectworkinfo();
		},
		computed: {
			...mapGetters(["userData"])
		},
		methods: {
			goBack() {
				uni.navigateBack()
			},
			getSelectworkinfo() {
				this.$apiRequest.bzhzyApi.selectworkinfo({
					workPlanId: this.work.id,
					consultationDeductionId: this.work.OBJID,
					pageFlag: this.work.pageFlag
				}).then(res => {
					if (res.data) {
						this.fieldValue.workPlanId = res.data.workPlanId
						this.fieldValue.consultationDeductionId = res.data.consultationDeductionId
						this.fieldValue.workPlanStrtime = res.data.workPlanStrtime
						this.fieldValue.workPlanEndtime = res.data.workPlanEndtime
						this.planTime = this.fieldValue.workPlanStrtime + "-" + this.fieldValue.workPlanEndtime
						this.fieldValue.workPlanPerson = res.data.workPlanPerson
						this.fieldValue.workPlanPersonId = res.data.workPlanPersonId
						this.fieldValue.discussers2 = res.data.peoplelistId2
						this.fieldValue.discussers3 = res.data.peoplelistId3
						this.fieldValue.discussers3Name = res.data.peoplelistName3
						this.fieldValue.discussers2Name = res.data.peoplelistName2
					}
				})
			},
			/**
			 * 通知上一个页面刷新数据
			 */
			back() {
				let pages = getCurrentPages();
				let prevPage = pages[pages.length - 2]; //上一个页面
				prevPage.isRefresh = true
				uni.navigateBack()
			},
			// 提交-按钮
			async affirmClick() {
				await this.$refs.ruleForm
					.validate()
					.then(() => {
						Dialog.confirm({
							message: '是否确认提交？',
							confirmButtonColor: "#417adc"
						}).then(() => {
							this.fieldValue.workPlanId = this.work.id;
							this.fieldValue.consultationDeductionId = this.work.OBJID;
							this.fieldValue.tFlowContentId = this.work.flowId
							this.$apiRequest.bzhzyApi.updateworkinfo(this.fieldValue).then(res => {
								this.clearParam()
								Toast.success(res.msg);
								this.back()
							}).catch(error => {
								console.log(error)
							})
						})

					})
					.catch((error) => {

						Toast('请完善内容')
					})
			},
			/**
			 * 清除数据
			 */
			clearParam() {
				this.fieldValue = {
					workPlanId: '',
					consultationDeductionId: '',
					workPlanStrtime: '',
					workPlanEndtime: '',
					workPlanPerson: '',
					discussers2: '',
					discussers3: ''
				}
				this.staffList = {} //人员数据
			},
			/**
			 * 班组成员
			 */
			userComfirm() {
				this.showSelectUser = false
				if (this.peopleType === "班组成员") {
					this.fieldValue.discussers2Name = this.staffList.text
					this.fieldValue.discussers2 = this.staffList.ids.join()
				} else {
					this.fieldValue.workPlanPerson = this.staffList.text
					this.fieldValue.workPlanPersonId = this.staffList.ids.join()
				}
			},
			/**
			 * 外部厂商成员选择
			 */
			userExternalComfirm() {
				this.showSelectExternalUser = false
				this.fieldValue.discussers3Name = this.ExternalUserList.text
				this.fieldValue.discussers3 = this.ExternalUserList.ids.join()
			},
			handleSelectUser(name) {		
				this.peopleType = name
				if (name === "责任人") {
					this.showSelectUser = true
					this.selectStatus = 'radio'
					this.staffList = {
						text: this.fieldValue.workPlanPerson,
						ids: this.fieldValue.workPlanPersonId
					}
				} else if (name === "班组成员") {
					this.showSelectUser = true
					this.selectStatus = 'checkbox'
					this.staffList = {
						text: this.fieldValue.discussers2Name,
						ids: this.fieldValue.discussers2
					}
				} else if (name === "外部厂商成员") {
					this.showSelectExternalUser = true
					this.ExternalUserList = {
						text: this.fieldValue.discussers3Name,
						ids: this.fieldValue.discussers3
					}
				}
			},
			formatDate(date) {
				return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
			},
			onConfirm(date) {
				this.showDate = false;
				if (date.length > 1) {
					const [start, end] = date;
					this.planTime = `${this.formatDate(start)} - ${this.formatDate(end)}`;
					this.fieldValue.workPlanStrtime = this.formatDate(start);
					this.fieldValue.workPlanEndtime = this.formatDate(end)
				} else {
					const [start] = date;
					this.planTime = this.formatDate(start);
					this.fieldValue.workPlanStrtime = this.formatDate(start);
					// this.fieldValue.workPlanEndtime = this.formatDate(start)
				}
			},
			/**
			 * @param {Object} tag start 开始  end结束时间
			 */
			changePlanTime(tag) {
				this.showDate = true
				this.planTimeTag = tag
			},
			/**
			 * @param {Object} currentDate
			 */
			selectTime(currentDate) {
				let timeString = "";
				timeString = moment(currentDate).format('YYYY-MM-DD HH:mm')
				if (this.planTimeTag === "start") {
					this.fieldValue.workPlanStrtime = timeString
				} else if (this.planTimeTag === "end") {
					this.fieldValue.workPlanEndtime = timeString
				}
				if (this.timeStamp(this.fieldValue.workPlanEndtime) > 0 && this.timeStamp(this.fieldValue
						.workPlanStrtime) > this.timeStamp(this.fieldValue.workPlanEndtime)) {
					this.fieldValue.workPlanEndtime = ""
					Toast('结束时间不能早于开始时间')
				}
				this.showDate = false
			},
			timeStamp(time) {
				if (time) {
					return moment(time).unix()
				}
				return 0
			}
		}
	}
</script>

<style lang="scss" scoped>
	.jobInfo {
		width: 100vw;
		height: 100vh;
		background: #F2F6FA;

		.main {
			.van-form {
				margin: px2vh(30);

				.top-filed {
					margin-bottom: px2vh(30);
				}
			}

			.verify {
				.van-button--normal {
					width: calc(100% - #{px2vw(60)});
					height: px2vh(120);
					font-size: px2vh(46);
					background: #417ADC;
					border: 1px solid #417ADC;
					position: absolute;
					bottom: px2vh(60);
					left: px2vw(30);
				}
			}
		}
	}
</style>
